<script setup lang="ts">
import { ref } from 'vue'

// 弹窗组件实例，用于操作弹窗
const popupRef = ref<UniHelper.UniPopupInstance>()
// 打开弹窗
const openPopup = () => {
  popupRef.value?.open?.()
}

// 关闭弹窗
const closePopup = () => {
  popupRef.value?.close?.()
}
</script>

<template>
  <view>
    <button @click="openPopup" type="primary">打开弹窗</button>
    <uni-popup ref="popupRef" type="bottom" background-color="#fff" borderRadius="30rpx 30rpx 0 0">
      <button @click="closePopup" type="warn">点击关闭</button>
      <view>弹窗内容</view>
      <image src="/static/logo.png" mode="widthFix" />
    </uni-popup>
  </view>
</template>